<template>
  <div>
    <!-- 回访 -->
    <el-form
      :model="addForm"
      ref="addFormRef"
      label-position="top"
      :rules="rules"
    >
      <el-form-item label="是否需要回访" prop="reminderSwitch">
        <el-radio-group v-model="addForm.reminderSwitch">
          <el-radio-button label="是" :value="1" />
          <el-radio-button label="否" :value="2" />
        </el-radio-group>
      </el-form-item>

      <el-form-item
        label="回访周期(天)"
        prop="visitCycleDays"
        v-if="addForm.reminderSwitch == 1"
      >
        <el-input-number
          v-model="addForm.visitCycleDays"
          placeholder="请输入回访周期"
          class="w-full"
          :min="1"
          :precision="0"
        />
      </el-form-item>
      <el-form-item
        label="备注"
        prop="whyVisit"
        v-if="addForm.reminderSwitch == 1"
      >
        <el-input
          type="textarea"
          :rows="5"
          v-model="addForm.whyVisit"
          placeholder="请输入回访原因"
          class="w-full"
        />
      </el-form-item>
    </el-form>

    <div class="fixed bottom-2 right-2">
      <el-button @click="handleBack(0)">取消</el-button>
      <el-button type="primary" :loading="loading" @click="handleSubmit">
        {{ loading ? "提交中..." : "提交" }}
      </el-button>
    </div>
  </div>
</template>

<script setup>
import { ref, onMounted } from "vue";
import { ElMessage, ElMessageBox } from "element-plus";
import { handleApiResponse } from "@/utils/request.js";
import {
  GetVisitCycleByCustomer,
  ControlVisitCycleSwitch,
  UpdateVisitCycle,
} from "../../../../../wailsjs/go/api/CustomerApi";

onMounted(() => {
  getDetail();
});

const emit = defineEmits(["handleBack"]);
const props = defineProps({
  detailForm: {
    type: Object,
    default: () => {},
  },
});

const addFormRef = ref(null);
const addForm = ref({});
async function getDetail() {
  handleApiResponse(() =>
    GetVisitCycleByCustomer({ id: props.detailForm.id })
  ).then((res) => {
    if (res.code == 0) {
      addForm.value = res.data || {};
    }
  });
}

const loading = ref(false);
const handleSubmit = () => {
  addFormRef.value.validate((valid) => {
    if (!valid) return;
    loading.value = true;
    handleApiResponse(() =>
      ControlVisitCycleSwitch({
        customerId: props.detailForm.id,
        reminderSwitch: addForm.value.reminderSwitch,
      })
    ).then((res) => {
      if (res.code == 0) {
        if (addForm.value.reminderSwitch == 1) {
          handleApiResponse(() =>
            UpdateVisitCycle({
              customerId: props.detailForm.id,
              ...addForm.value,
            })
          ).then((res) => {
            if (res.code == 0) {
              handleBack(1);
              ElMessage.success("操作成功");
            }
            loading.value = false;
          });
        } else {
          handleBack(1);
          ElMessage.success("操作成功");
        }
      }
      if (addForm.value.reminderSwitch == 2) {
        loading.value = false;
      }
    });
  });
};
const handleBack = (val = 0) => {
  emit("handleBack", val);
};

const rules = ref({
  reminderSwitch: [{ required: true, message: "请选择" }],
});
</script>

<style scoped lang="scss">
</style>